<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.js"></script>
</head>
<body>
        <div id="app">
    <div><input type="text" v-model="checked">多选</div>
    <div>
         <input type="checkbox" v-model="checked1" value="足球">足球
         <input type="checkbox" v-model="checked1" value="篮球">篮球
         <input type="checkbox" v-model="checked1" value="橄榄球">橄榄球
    </div>
    <div>
         <input type="radio" v-model="checked2" value="male">男
         <input type="radio" v-model="checked2" value="female">女
    </div>
    <div>
        <select v-model="selected">
           <option v-for="item in city" value="item.spell">{{item.name}}</option>
        </select>
    </div>
    </div>
    <script>
 new Vue({
 el:"#app",   
 data:{
     content:'',
     checked:true,
     checked1:[],
     checked2:'',
     selected:"",
     city:[
         {spell:'CQ',name:"重庆"},
         {spell:'BJ',name:"北京"},
         {spell:'SH',name:"上海"}
         ]
 }
 })
    
    </script>
</body>
</html>